<template>
  <div class="dayQualityControl tapStyle secondary-page-mode">
    <div class="currency-mode-wrap" style="margin-top: 0;height: 100%;">
      <!-- <div class="reminder-wrap">
        <span class="reminder-title">温馨提示</span>
        <div class="reminder-content" style="width: 100%">
          <div class="reminder-text">
            <p>该点位最新一次质控参数设置于xxxx年xx月xx日，至今已使用xx年xx月x天；期间日质控合格了m次；不合格了m次。造成无效数据xx条</p>
            <div>
              <el-button type="noticonsecondBtn">生成任务</el-button>
            </div>
          </div>
        </div>
      </div> -->
      <div class="currency-body-wrap">
        <el-scrollbar style="height: 100%;">
          <div v-show="tabActive === 0">
            <div class="modular-box">
              <div class="modular-header">
                <span class="title">当前使用24小时质控参数信息</span>
              </div>
              <div class="modular-body">
                <div class="modular-row clear">
                  <div class="statistics-text clear">
                    <span>{{levDesone}}: {{currentLev}}</span>
                    <span>{{levDestwo}}: {{targetLev}}</span>
                  </div>
                  <!-- <div class="statistics-text clear">
                    <span>距上次质控已有x天x小时x分x秒</span>
                  </div> -->
                  <div class="toolbar">
                    <el-button
                      style="margin: 0;display: inline-block;vertical-align: middle;"
                      @click="dailyQuality = true;"
                    >参数设置</el-button>
                  </div>
                </div>
                <div class="table-box" style="padding: 0 6px 6px;">
                  <el-table :data="tableData" border style="width: 100%">
                    <el-table-column prop="indexName" label="监测项目"></el-table-column>
                    <el-table-column prop="source" label="来源"></el-table-column>
                    <el-table-column prop="testPoint" label="测试点"></el-table-column>
                    <el-table-column prop="standardValue" label="标液浓度"></el-table-column>
                    <el-table-column prop="submitTime" width="160" label="提交时间"></el-table-column>
                    <el-table-column prop="submitter" label="提交人"></el-table-column>
                    <el-table-column prop="auditTime" width="160" label="审核时间"></el-table-column>
                    <el-table-column prop="auditor" :show-overflow-tooltip="true" label="审核人"></el-table-column>
                    <el-table-column prop="operation" width="188px" label="操作">
                      <template slot-scope="scope">
                        <a v-if="scope.row.operation === 0" class="link-btn">查看审核记录</a>
                        <el-button type="secondBtn">审核</el-button>
                      </template>
                    </el-table-column>
                    <!--<el-table-column
                      prop="historicalRecord"
                      label="设置">
                      <template slot-scope="scope">
                        <span v-if="scope.row.operation === 0" style="color: #666">无相应权限</span>
                        <el-button @click="singlePoint = true" type="secondBtn">设置</el-button>
                      </template>
                    </el-table-column>-->
                  </el-table>
                </div>
              </div>
            </div>
            <div class="modular-box">
              <div class="modular-header">
                <span class="title">历史周质控参数信息</span>
                <div class="toolbar">
                  <span>时间范围 :</span>
                  <div class="layoutBox" style="width:242px">
                    <el-date-picker
                      v-model="multipointDateRange"
                      align="right"
                      type="daterange"
                      start-placeholder="开始日期"
                      end-placeholder="结束日期"
                    ></el-date-picker>
                  </div>&emsp;
                  <el-button style="margin: 0;" @click="getHistoryCurrentData()">
                    <i class="iconfont icon-sousuo"></i>查询
                  </el-button>
                </div>
              </div>
              <div class="modular-body">
                <div class="modular-row">
                  <div class="state-radio-wrap" style="padding-bottom: 6px;">
                    <el-radio-group
                      v-model="stateRadio"
                      size="small"
                      @change="getHistoryCurrentData()"
                    >
                      <el-radio-button
                        v-for="(item,key) in radioData"
                        :label="item.id"
                        :key="key"
                      >{{item.label}}</el-radio-button>
                    </el-radio-group>
                  </div>
                  <!--<div class="statistics-text clear">
                    <span class="title">水温（℃）</span>
                  </div>-->
                  <!-- <div class="statistics-text clear">
                    <span>该时间段共有周质控x次，合格m次，不合格n次，影响数据y条</span>
                  </div> -->
                </div>
                <div class="table-box" style="padding: 0 6px 6px;">
                  <div
                    class="week-row clear"
                    v-for="(item,index) in historyCurrentData"
                    :key="index"
                  >
                    <div class="date-box">
                      <p class="month">{{ setMonthConvert(item.monthTime) }}</p>
                      <p class="label">{{ new Date(item.monthTime).format('yyyy年') }}</p>
                    </div>
                    <ul class="quality-control-list clear">
                      <li v-for="(n,m) in item.list" :key="m+'s'">
                        <div>{{ m+1 }}</div>
                        <div>浓度：{{ n.standardValue }}</div>
                        <div>申请人：--</div>
                        <div>提交：{{ n.submitTimeDay }}</div>
                        <div>审核：{{ n.auditTime }}</div>
                      </li>
                      <!--<li>
                        <div>2</div>
                        <div>浓度：18 &emsp;14:29</div>
                        <div>申请人：张三峰</div>
                        <div>提交：18 &emsp;14:29</div>
                        <div>审核：18 &emsp;14:29</div>
                      </li>
                      <li>
                        <div>3</div>
                        <div>浓度：18 &emsp;14:29</div>
                        <div>申请人：张三峰</div>
                        <div>提交：18 &emsp;14:29</div>
                        <div>审核：18 &emsp;14:29</div>
                      </li>
                      <li>
                        <div>4</div>
                        <div>浓度：18 &emsp;14:29</div>
                        <div>申请人：张三峰</div>
                        <div>提交：18 &emsp;14:29</div>
                        <div>审核：18 &emsp;14:29</div>
                      </li>-->
                    </ul>
                    <div class="correlation-box">
                      <div>
                        <p>相似关系</p>
                        <p class="data">9.96%</p>
                      </div>
                      <div>
                        <p class="qualified">合格</p>
                      </div>
                    </div>
                    <div class="influence-box">
                      <p class="label">影响数据</p>
                      <p class="data">2312条</p>
                    </div>
                  </div>
                  <!--<div class="week-row clear">
                    <div class="date-box">
                      <p class="month">二月</p>
                      <p class="label">2018年</p>
                    </div>
                    <ul class="quality-control-list clear">
                      <li>
                        <div>1</div>
                        <div>浓度：18 &emsp;14:29</div>
                        <div>申请人：张三峰</div>
                        <div>提交：18 &emsp;14:29</div>
                        <div>审核：18 &emsp;14:29</div>
                      </li>
                      <li>
                        <div>2</div>
                        <div>浓度：18 &emsp;14:29</div>
                        <div>申请人：张三峰</div>
                        <div>提交：18 &emsp;14:29</div>
                        <div>审核：18 &emsp;14:29</div>
                      </li>
                      <li>
                        <div>3</div>
                        <div>浓度：18 &emsp;14:29</div>
                        <div>申请人：张三峰</div>
                        <div>提交：18 &emsp;14:29</div>
                        <div>审核：18 &emsp;14:29</div>
                      </li>
                      <li>
                        <div>4</div>
                        <div>浓度：18 &emsp;14:29</div>
                        <div>申请人：张三峰</div>
                        <div>提交：18 &emsp;14:29</div>
                        <div>审核：18 &emsp;14:29</div>
                      </li>
                    </ul>
                    <div class="correlation-box">
                      <div>
                        <p>相似关系</p>
                        <p class="data">9.96%</p>
                      </div>
                      <div>
                        <p class="unqualified">不合格</p>
                      </div>
                    </div>
                    <div class="influence-box">
                      <p class="label">影响数据</p>
                      <p class="data">2312条</p>
                    </div>
                  </div>-->
                </div>
              </div>
            </div>
          </div>
          <div v-show="tabActive === 1">
            <div class="modular-box">
              <div class="modular-header">
                <span class="title">当前使用集成干预测试质控参数信息</span>
              </div>
              <div class="modular-body">
                <div class="modular-row clear">
                  <div class="statistics-text clear">
                     <span>{{levDesone}}: {{currentLev}}</span>
                    <span>{{levDestwo}}: {{targetLev}}</span>
                  </div>
                  <!-- <div class="statistics-text clear">
                    <span>距上次质控已有x天x小时x分x秒</span>
                  </div> -->
                  <div class="toolbar">
                    <el-button
                      style="margin: 0;display: inline-block;vertical-align: middle;"
                      @click="integrated=true"
                    >参数设置</el-button>
                  </div>
                </div>
                <div class="table-box" style="padding: 0 6px 6px;">
                  <el-table :data="integratedTable" border style="width: 100%">
                    <el-table-column prop="indexName" label="监测项目"></el-table-column>
                    <el-table-column prop="notIntegratedTime" label="未过集成测试时间"></el-table-column>
                    <el-table-column prop="overIntegratedTime" label="已过集成测试时间"></el-table-column>
                    <el-table-column prop="submitTime" width="160" label="提交时间"></el-table-column>
                    <el-table-column prop="submitter" label="提交人"></el-table-column>
                    <el-table-column prop="auditTime" width="160" label="审核时间"></el-table-column>
                    <el-table-column prop="auditor" :show-overflow-tooltip="true" label="审核人"></el-table-column>
                    <el-table-column prop="operation" width="188px" label="操作">
                      <template slot-scope="scope">
                        <a v-if="scope.row.operation === 0" class="link-btn">查看审核记录</a>
                        <el-button type="secondBtn">审核</el-button>
                      </template>
                    </el-table-column>
                    <!--<el-table-column
                      prop="historicalRecord"
                      label="设置">
                      <template slot-scope="scope">
                        <span v-if="scope.row.operation === 0" style="color: #666">无相应权限</span>
                        <el-button @click="integratedInspect = true" type="secondBtn">设置</el-button>
                      </template>
                    </el-table-column>-->
                  </el-table>
                </div>
              </div>
            </div>
            <div class="modular-box">
              <div class="modular-header">
                <span class="title">历史周质控参数信息</span>
                <div class="toolbar">
                  <span>时间范围 :</span>
                  <div class="layoutBox" style="width:242px">
                    <el-date-picker
                      v-model="dateRangeJ"
                      align="right"
                      type="daterange"
                      start-placeholder="开始日期"
                      end-placeholder="结束日期"
                    ></el-date-picker>
                  </div>&emsp;
                  <el-button style="margin: 0;" @click="getHistoryIntervention()">
                    <i class="iconfont icon-sousuo"></i>查询
                  </el-button>
                </div>
              </div>
              <div class="modular-body">
                <div class="modular-row">
                  <div class="state-radio-wrap" style="padding-bottom: 6px;">
                    <el-radio-group
                      v-model="stateRadioJ"
                      size="small"
                      @change="getHistoryIntervention()"
                    >
                      <el-radio-button
                        v-for="(item,key) in radioData"
                        :label="item.id"
                        :key="key"
                      >{{item.label}}</el-radio-button>
                    </el-radio-group>
                  </div>
                  <!--<div class="statistics-text clear">
                    <span class="title">水温（℃）</span>
                  </div>-->
                  <!-- <div class="statistics-text clear">
                    <span>该时间段共有周质控x次，合格m次，不合格n次，影响数据y条</span>
                  </div> -->
                </div>
                <div class="table-box" style="padding: 0 6px 6px;">
                  <el-table :data="integratedTableHis" border style="width: 100%">
                    <el-table-column prop="monthWeek" label="周数"></el-table-column>
                    <el-table-column prop="notIntegratedTime" width="170" label="未过集成测试时间"></el-table-column>
                    <el-table-column prop="overIntegratedTime" width="170" label="已过集成测试时间"></el-table-column>
                    <el-table-column prop="subTime" width="160" label="提交时间"></el-table-column>
                    <el-table-column prop="submitter" label="提交人"></el-table-column>
                    <el-table-column prop="auditTime" width="160" label="审核时间"></el-table-column>
                    <el-table-column prop="auditor" label="审核人"></el-table-column>
                    <el-table-column prop="auditTime" label="自动取样"></el-table-column>
                    <el-table-column prop="auditTime" label="人工采样"></el-table-column>
                    <el-table-column prop="auditTime" label="误差"></el-table-column>
                    <el-table-column prop="auditTime" label="技术要求"></el-table-column>
                    <el-table-column prop="auditTime" label="是否合格"></el-table-column>
                    <el-table-column prop="auditTime" label="影响数据"></el-table-column>
                  </el-table>
                </div>
              </div>
            </div>
          </div>
          <div v-show="tabActive === 2">
            <div class="modular-box">
              <div class="modular-header">
                <span class="title">当前使用实际水样比对质控参数信息</span>
              </div>
              <div class="modular-body">
                <div class="modular-row clear">
                  <div class="statistics-text clear">
                     <span>{{levDesone}}: {{currentLev}}</span>
                    <span>{{levDestwo}}: {{targetLev}}</span>
                  </div>
                  <!-- <div class="statistics-text clear">
                    <span>距上次质控已有x天x小时x分x秒</span>
                  </div> -->
                  <div class="toolbar">
                    <el-button
                      @click="waterSample = true"
                      style="margin: 0;display: inline-block;vertical-align: middle;"
                    >参数设置</el-button>
                  </div>
                </div>
                <div class="table-box" style="padding: 0 6px 6px;">
                  <el-table :data="sampleRatioTable" height="100%" border style="width: 100%">
                    <el-table-column prop="testTime" label="测试时间"></el-table-column>
                    <el-table-column prop="submitTime" width="160" label="提交时间"></el-table-column>
                    <el-table-column prop="submitter" label="提交人"></el-table-column>
                    <el-table-column prop="auditTime" width="160" label="审核时间"></el-table-column>
                    <el-table-column prop="auditor" :show-overflow-tooltip="true" label="审核人"></el-table-column>
                    <el-table-column prop="operation" width="188px" label="操作">
                      <template slot-scope="scope">
                        <a v-if="scope.row.operation === 0" class="link-btn">查看审核记录</a>
                        <el-button type="secondBtn">审核</el-button>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>
              </div>
            </div>
          </div>
          <div v-show="tabActive === 3">
            <div class="modular-box">
              <div class="modular-header">
                <span class="title">当前使用加标回收率质控参数信息</span>
              </div>
              <div class="modular-body">
                <div class="modular-row clear">
                  <div class="statistics-text clear">
                     <span>{{levDesone}}: {{currentLev}}</span>
                    <span>{{levDestwo}}: {{targetLev}}</span>
                  </div>
                  <!-- <div class="statistics-text clear">
                    <span>距上次质控已有x天x小时x分x秒</span>
                  </div> -->
                  <div class="toolbar">
                    <el-button
                      @click="recoveryRate = true"
                      style="margin: 0;display: inline-block;vertical-align: middle;"
                    >参数设置</el-button>
                  </div>
                </div>
                <div class="table-box" style="padding: 0 6px 6px;">
                  <el-table :data="recoveryRateTable" height="100%" border style="width: 100%">
                    <el-table-column prop="indexName" label="监测项目"></el-table-column>
                    <el-table-column prop="addConcentration" label="加标样浓度"></el-table-column>
                    <el-table-column prop="constantVolume" label="定容体积"></el-table-column>
                    <el-table-column prop="submitTime" width="160" label="提交时间"></el-table-column>
                    <el-table-column prop="submitter" label="提交人"></el-table-column>
                    <el-table-column prop="auditTime" width="160" label="审核时间"></el-table-column>
                    <el-table-column prop="auditor" :show-overflow-tooltip="true" label="审核人"></el-table-column>
                    <el-table-column prop="operation" width="188px" label="操作">
                      <template slot-scope="scope">
                        <a v-if="scope.row.operation === 0" class="link-btn">查看审核记录</a>
                        <el-button type="secondBtn">审核</el-button>
                      </template>
                    </el-table-column>
                    <!--<el-table-column
                      prop="historicalRecord"
                      label="设置">
                      <template slot-scope="scope">
                        <span v-if="scope.row.operation === 0" style="color: #666">无相应权限</span>
                        <el-button @click="recoveryRateAlone = true" type="secondBtn">设置</el-button>
                      </template>
                    </el-table-column>-->
                  </el-table>
                </div>
              </div>
            </div>
            <div class="modular-box">
              <div class="modular-header">
                <span class="title">历史周质控参数信息</span>
                <div class="toolbar">
                  <span>时间范围 :</span>
                  <div class="layoutBox" style="width:242px">
                    <el-date-picker
                      v-model="dateRange"
                      align="right"
                      type="daterange"
                      start-placeholder="开始日期"
                      end-placeholder="结束日期"
                    ></el-date-picker>
                  </div>&emsp;
                  <el-button style="margin: 0;" @click="historyIntegratedParam()">
                    <i class="iconfont icon-sousuo"></i>查询
                  </el-button>
                </div>
              </div>
              <div class="modular-body">
                <div class="modular-row">
                  <div class="state-radio-wrap" style="padding-bottom: 6px;">
                    <el-radio-group
                      v-model="stateRadioAdd"
                      size="small"
                      @change="historyIntegratedParam()"
                    >
                      <el-radio-button
                        v-for="(item,key) in radioData"
                        :label="item.id"
                        :key="key"
                      >{{item.label}}</el-radio-button>
                    </el-radio-group>
                  </div>
                  <!-- <div class="statistics-text clear">
                    <span class="title">水温（℃）</span>
                  </div>-->
                  <!-- <div class="statistics-text clear">
                    <span>该时间段共有周质控x次，合格m次，不合格n次，影响数据y条</span>
                  </div> -->
                </div>
                <div class="table-box" style="padding: 0 6px 6px;">
                  <el-table :data="recoveryRateTableHis" border style="width: 100%">
                    <el-table-column prop="monthWeek" label="周数"></el-table-column>
                    <el-table-column prop="submitTime" width="160" label="提交时间"></el-table-column>
                    <el-table-column prop="submitter" label="提交人"></el-table-column>
                    <el-table-column prop="auditTime" width="160" label="审核时间"></el-table-column>
                    <el-table-column prop="auditor" label="审核人"></el-table-column>
                    <el-table-column prop="auditTime" label="加标液浓度"></el-table-column>
                    <el-table-column prop="auditTime" label="定容体积"></el-table-column>
                    <el-table-column prop="auditTime" label="是否合格"></el-table-column>
                    <el-table-column prop="auditTime" label="影响数据"></el-table-column>
                  </el-table>
                </div>
              </div>
            </div>
          </div>
          <div v-show="tabActive === 4">
            <div class="modular-box">
              <div class="modular-header">
                <span class="title">当前使用标样核查质控参数信息</span>
              </div>
              <div class="modular-body">
                <div class="modular-row clear">
                  <div class="statistics-text clear">
                     <span>{{levDesone}}: {{currentLev}}</span>
                    <span>{{levDestwo}}: {{targetLev}}</span>
                  </div>

                  <div class="toolbar">
                    <el-button
                      @click="dailyBY=true"
                      style="margin: 0;display: inline-block;vertical-align: middle;"
                    >参数设置</el-button>
                  </div>
                </div>
                <div class="table-box" style="padding: 0 6px 6px;">
                  <el-table :data="tableDataBYone" border style="width: 100%">
                    <el-table-column prop="indexName" label="监测项目"></el-table-column>
                    <el-table-column prop="spanValue" label="量程值"></el-table-column>

                    <el-table-column prop="standardValue" label="标准溶液浓度"></el-table-column>
                    <el-table-column prop="submitTime" width="160" label="提交时间"></el-table-column>
                    <el-table-column prop="submitter" label="提交人"></el-table-column>
                    <el-table-column prop="auditTime" width="160" label="审核时间"></el-table-column>
                    <el-table-column prop="auditor" :show-overflow-tooltip="true" label="审核人"></el-table-column>
                    <el-table-column prop="operation" width="188px" label="操作">
                      <template slot-scope="scope">
                        <span v-if="scope.row.operation === 0" style="color: #666">无相应权限</span>
                        <el-button type="secondBtn">审核</el-button>
                        <!--<el-button @click="singleFactor = true"  type="secondBtn">设置</el-button>-->
                      </template>
                    </el-table-column>
                    <el-table-column prop="indexCount" label="历史记录"></el-table-column>
                  </el-table>
                </div>
              </div>
            </div>
            <div class="modular-box">
              <div class="modular-header">
                <span class="title">历史周质控参数信息</span>
                <div class="toolbar">
                  <span>时间范围 :</span>
                  <div class="layoutBox" style="width:242px">
                    <el-date-picker
                      v-model="dateRangeBY"
                      align="right"
                      type="daterange"
                      start-placeholder="开始日期"
                      end-placeholder="结束日期"
                    ></el-date-picker>
                  </div>&emsp;
                  <el-button style="margin: 0;" @click="getByhistoryDayQuality">
                    <i class="iconfont icon-sousuo"></i>查询
                  </el-button>
                </div>
              </div>
              <div class="modular-body">
                <div class="modular-row">
                  <div class="state-radio-wrap" style="padding-bottom: 6px;">
                    <el-radio-group
                      v-model="stateRadioBY"
                      size="small"
                      @change="getByhistoryDayQuality"
                    >
                      <el-radio-button
                        v-for="(item,key) in radioData"
                        :label="item.id"
                        :key="key"
                      >{{item.label}}</el-radio-button>
                    </el-radio-group>
                  </div>
                  <!-- <div class="statistics-text clear">
                    <span class="title">水温（℃）</span>
                  </div>-->
                  <!-- <div class="statistics-text clear">
                    <span>该时间段共有周质控x次，合格m次，不合格n次，影响数据y条</span>
                  </div> -->
                </div>
                <div class="table-box" style="padding: 0 6px 6px;">
                  <el-table :data="tableDataBYtwo" border>
                    <el-table-column prop="submitTime" label="提交时间"></el-table-column>
                    <el-table-column prop="submitter" label="提交人"></el-table-column>
                    <el-table-column prop="auditTime" label="审核时间"></el-table-column>
                    <el-table-column prop="auditor" label="审核人"></el-table-column>
                    <el-table-column prop="spanValue" label="量程值"></el-table-column>
                    <el-table-column prop="standardValue" label="标准溶液浓度"></el-table-column>
                    <el-table-column prop="useTime" label="使用时间"></el-table-column>
                    <el-table-column prop="qualityControl" label="质控次数"></el-table-column>
                    <el-table-column prop="unqualified" label="不合格次数"></el-table-column>
                    <el-table-column prop="impactData" label="影响数据"></el-table-column>
                  </el-table>
                </div>
              </div>
            </div>
          </div>
        </el-scrollbar>
      </div>
      <div class="currency-aside-wrap">
        <ul>
          <li
            v-for="(item,index) in tabList"
            :class="{active: tabActive===index}"
            @click="tabActive = index"
            :key="index"
          >{{ item.name }}</li>
        </ul>
      </div>
    </div>

    <!-- 项目设置详情弹窗 -->
    <el-dialog width="840px" title="项目设置详情" :visible.sync="projectSet">
      <div class="table-wrap" style="padding: 8px;">
        <el-table :data="dialogData" border style="width: 100%">
          <el-table-column prop="monitoringItems" label="监测项目"></el-table-column>
          <el-table-column prop="waterQuality" width="150" label="上一周的水质平均值">
            <template slot-scope="scope">
              <input class="editInput" type="text" v-model="scope.row.waterQuality" />
              <span>(mg/L)</span>
            </template>
          </el-table-column>
          <el-table-column prop="spanValue" label="跨度值">
            <template slot-scope="scope">
              <input class="editInput" type="text" v-model="scope.row.spanValue" />
              <span>(mg/L)</span>
            </template>
          </el-table-column>
          <el-table-column prop="zeroPoint" label="零点标准溶液浓度">
            <template slot-scope="scope">
              <input class="editInput" type="text" v-model="scope.row.zeroPoint" />
              <span>(mg/L)</span>
            </template>
          </el-table-column>
          <el-table-column prop="span" label="跨度标准溶液浓度">
            <template slot-scope="scope">
              <input class="editInput" type="text" v-model="scope.row.span" />
              <span>(mg/L)</span>
            </template>
          </el-table-column>
          <el-table-column prop="operation" label="操作">
            <template slot-scope="scope">
              <el-button type="secondBtn">
                <i class="iconfont icon-sousuo"></i>提交
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-dialog>

    <!-- 多点线性核查参数设置dialog弹窗 -->
    <el-dialog
      width="840px"
      title="项目设置详情"
      @close="resetDailyQualityTableData()"
      :visible.sync="dailyQuality"
    >
      <div class="daily-quality-box" style="padding: 8px;">
        <div class="daily-head-wrap">
          <div class="row clear">
            <span class="label">当前点位：{{stationName}}</span>
          </div>
          <div class="row clear">
              <span>{{levDesone}}: {{currentLev}}</span>
                    <span>{{levDestwo}}: {{targetLev}}</span>
          </div>
          <div class="row clear">
            <span class="label">所属区域：{{areaName}}</span>
            <span class="label">所属流域：{{basinName}}</span>
          </div>
        </div>
        <div class="daily-table-wrap">
          <table class="normal-table" width="100%">
            <tr>
              <th width="134px;">监测项目</th>
              <th v-for="(item,index) in dailyTableHead" :key="index">{{ item.name }}</th>
            </tr>
            <tr v-for="(item,index) in dailyQualityTable" :key="index">
              <td>{{ item.name }}</td>
              <td>
                <div class="layoutBox" style="width:80px">
                  <el-input
                    @change="changeMonitoringItems(item.acidSalt)"
                    v-model="item.acidSalt.value"
                  ></el-input>
                </div>
                <el-button type="secondBtn" @click="selectZeroPoint(item.acidSalt,index)">选择</el-button>
              </td>
              <td>
                <div class="layoutBox" style="width:80px">
                  <el-input
                    @change="changeMonitoringItems(item.ammonia)"
                    v-model="item.ammonia.value"
                  ></el-input>
                </div>
                <el-button type="secondBtn" @click="selectZeroPoint(item.ammonia,index)">选择</el-button>
              </td>
              <td>
                <div class="layoutBox" style="width:80px">
                  <el-input
                    @change="changeMonitoringItems(item.phosphorus)"
                    v-model="item.phosphorus.value"
                  ></el-input>
                </div>
                <el-button type="secondBtn" @click="selectZeroPoint(item.phosphorus,index)">选择</el-button>
              </td>
              <td>
                <div class="layoutBox" style="width:80px">
                  <el-input
                    @change="changeMonitoringItems(item.nitrogen)"
                    v-model="item.nitrogen.value"
                  ></el-input>
                </div>
                <el-button type="secondBtn" @click="selectZeroPoint(item.nitrogen,index)">选择</el-button>
              </td>
            </tr>
            <tr>
              <td></td>
              <td v-for="(item,index) in dailyTableHead">
                <el-button @click="singleFactorSubmission(item,index)" style="margin-right: 0;">提交</el-button>
              </td>
            </tr>
          </table>
          <div class="btn-wrap">
            <p class="be-careful-text">注意：选择是指选择零点核查或者跨度核查</p>
          </div>
        </div>
      </div>
    </el-dialog>

    <!-- 多点线性-选择零点核查跨度核查 -->
    <el-dialog width="740px" title="多点线性-选择零点核查跨度核查" :visible.sync="linearZeroPoint">
      <transition name="el-fade-in-linear">
        <div v-if="linearZeroPoint" class="linear-zero-point">
          <el-tabs type="border-card">
            <el-tab-pane label="零点核查信息">
              <el-table :data="zeroCheckTable" height="300px" border style="width: 100%">
                <el-table-column type="index" label="序号"></el-table-column>
                <el-table-column prop="time" label="监测时间"></el-table-column>
                <el-table-column prop="value" width="150" label="测试结果"></el-table-column>
                <el-table-column prop="standardSamplesValue" label="标准样浓度"></el-table-column>
                <el-table-column prop="operation" label="操作">
                  <template slot-scope="scope">
                    <el-button @click="selectZeroData(scope.row)" type="secondBtn">选择</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-tab-pane>
            <el-tab-pane label="跨度核查信息">
              <el-table :data="spanVerification" border height="300px" style="width: 100%">
                <el-table-column type="index" label="序号"></el-table-column>
                <el-table-column prop="time" label="监测时间"></el-table-column>
                <el-table-column prop="value" width="150" label="测试结果"></el-table-column>
                <el-table-column prop="standardSamplesValue" label="标准样浓度"></el-table-column>
                <el-table-column prop="operation" label="操作">
                  <template slot-scope="scope">
                    <el-button @click="selectSpanData(scope.row)" type="secondBtn">选择</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-tab-pane>
          </el-tabs>
        </div>
      </transition>
    </el-dialog>

    <!-- 单因子单点设置弹窗 -->
    <!--<el-dialog
      width="300px" title="单因子单点设置"
      :visible.sync="singlePoint" >
      <div class="single-point-wrap">
        <div>当前测试点：第2点</div>
        <div>浓度：<div class="layoutBox" style="width:80px">
                    <el-input v-model="singleNum"></el-input>
                  </div> &emsp;选择</div>
        <div>注：第一点，第4点的时候才出现</div>
        <div style="text-align: center;">
          <el-button>提交</el-button>
        </div>
      </div>
    </el-dialog>-->

    <!-- 集成干预检查批量设置 -->
    <el-dialog width="884px" @close="resetIntegrated()" title="集成干预检查设置" :visible.sync="integrated">
      <div class="table-wrap integrated-intervention">
        <table class="normal-table" style="width: 100%">
          <tr>
            <th>监测项目</th>
            <th v-for="(item,index) in dailyTableHead" :key="index">{{ item.name }}</th>
            <!-- <th>氨氮</th>
            <th>总磷</th>
            <th>总氮</th>-->
          </tr>
          <tr v-for="(item,index) in interventionList" :key="index">
            <td>{{ item.name }}</td>
            <td>
              <div class="layoutBox" style="width:170px">
                <el-date-picker v-model="item.acidSalt" type="datetime"></el-date-picker>
              </div>
            </td>
            <td>
              <div class="layoutBox" style="width:170px">
                <el-date-picker v-model="item.ammonia" type="datetime"></el-date-picker>
              </div>
            </td>
            <td>
              <div class="layoutBox" style="width:170px">
                <el-date-picker v-model="item.phosphorus" type="datetime"></el-date-picker>
              </div>
            </td>
            <td>
              <div class="layoutBox" style="width:170px">
                <el-date-picker v-model="item.nitrogen" type="datetime"></el-date-picker>
              </div>
            </td>
          </tr>
          <tr>
            <td></td>
            <td v-for="(item,index) in dailyTableHead" :key="index" @click="submitIntegrated(item)">
              <el-button>提交</el-button>
            </td>
          </tr>
        </table>
        <div class="btn-wrap">
          <el-button @click="batchSubmitIntegrated()" style="width: 100px;">批量提交</el-button>
        </div>
      </div>
    </el-dialog>

    <!-- 集成干预检查单独设置 -->
    <el-dialog width="324px" title="集成干预检查单独设置" :visible.sync="integratedInspect">
      <div class="table-wrap integrated-intervention">
        <table class="normal-table">
          <tr>
            <th>监测项目</th>
            <th>高锰酸盐指数</th>
          </tr>
          <tr>
            <td>已经过集成测试</td>
            <td>
              <div class="layoutBox" style="width:140px">
                <el-date-picker v-model="integrateDate" type="date"></el-date-picker>
              </div>
            </td>
          </tr>
          <tr>
            <td>未经过集成测试</td>
            <td>
              <div class="layoutBox" style="width:140px">
                <el-date-picker v-model="integrateDate" type="date"></el-date-picker>
              </div>
            </td>
          </tr>
          <tr>
            <td></td>
            <td>
              <el-button>提交</el-button>
            </td>
          </tr>
        </table>
      </div>
    </el-dialog>

    <!-- 实际水样对比设置 -->
    <el-dialog
      width="324px"
      title="实际水样对比设置"
      @close="waterSampleDate = ''"
      :visible.sync="waterSample"
    >
      <div class="table-wrap integrated-intervention">
        <table class="normal-table">
          <tr>
            <td>水样测试时间</td>
            <td>
              <div class="layoutBox" style="width:180px">
                <el-date-picker v-model="waterSampleDate" type="datetime"></el-date-picker>
              </div>
            </td>
          </tr>
          <tr>
            <td></td>
            <td>
              <el-button @click="setWaterSampleDate()">提交</el-button>
            </td>
          </tr>
        </table>
      </div>
    </el-dialog>

    <!-- 加标回收率批量设置 -->
    <el-dialog
      width="840px"
      @click="resetRecoveryListData()"
      title="加标回收率批量设置"
      :visible.sync="recoveryRate"
    >
      <div class="daily-table-wrap recovery-rate">
        <table class="normal-table">
          <tr>
            <th width="134px;">监测项目</th>
            <th v-for="(item,index) in dailyTableHead" :key="index">{{ item.name }}</th>
            <!--<th>氨氮</th>
            <th>总磷</th>
              acidSalt:'',
          ammonia:'',
          phosphorus:'',
          nitrogen:'',

            <th>总氮</th>-->
          </tr>
          <tr v-for="(item,index) in recoveryList" :key="index">
            <td>{{ item.name }}</td>
            <td>
              <div class="layoutBox" style="width:80px">
                <el-input v-model="item.acidSalt"></el-input>
              </div>
              <span class="company-text">({{ item.company }})</span>
            </td>
            <td>
              <div class="layoutBox" style="width:80px">
                <el-input v-model="item.ammonia"></el-input>
              </div>
              <span class="company-text">({{ item.company }})</span>
            </td>
            <td>
              <div class="layoutBox" style="width:80px">
                <el-input v-model="item.phosphorus"></el-input>
              </div>
              <span class="company-text">({{ item.company }})</span>
            </td>
            <td>
              <div class="layoutBox" style="width:80px">
                <el-input v-model="item.nitrogen"></el-input>
              </div>
              <span class="company-text">({{ item.company }})</span>
            </td>
          </tr>
          <!-- <tr>
            <td>定容体积</td>
            <td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>
            <td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>
            <td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>
            <td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>
          </tr>-->
          <tr>
            <td></td>
            <td v-for="(item,index) in dailyTableHead" :key="index">
              <el-button @click="submitRecoveryRate(item,index)">提交</el-button>
            </td>
            <!-- <td><el-button>提交</el-button></td>
            <td><el-button>提交</el-button></td>
            <td><el-button>提交</el-button></td>-->
          </tr>
        </table>
        <div class="btn-wrap">
          <el-button @click="batchSubmitRecoveryRate()" style="width: 100px;">批量提交</el-button>
        </div>
      </div>
    </el-dialog>

    <!-- 加标回收率单独设置 -->
    <el-dialog width="380px" title="加标回收率单独设置" :visible.sync="recoveryRateAlone">
      <div class="daily-table-wrap recovery-rate">
        <table class="normal-table">
          <tr>
            <th width="134px;">监测项目</th>
            <th>高锰酸盐</th>
          </tr>
          <tr>
            <td>加标样浓度</td>
            <td>
              <div class="layoutBox" style="width:80px">
                <el-input v-model="tableInput"></el-input>
              </div>（mg/L）
            </td>
          </tr>
          <tr>
            <td>定容体积</td>
            <td>
              <div class="layoutBox" style="width:80px">
                <el-input v-model="tableInput"></el-input>
              </div>（mg/L）
            </td>
          </tr>
          <tr>
            <td></td>
            <td>
              <el-button>提交</el-button>
            </td>
          </tr>
        </table>
      </div>
    </el-dialog>
    <!-- 标样核查设置 -->
    <el-dialog width="840px" title="标样核查设置" :visible.sync="dailyBY">
      <div class="daily-quality-box" style="padding: 8px;">
        <div class="row clear">
          <span class="label">当前点位：{{stationName}}</span>
        </div>
        <div class="row clear">
           <span>{{levDesone}}: {{currentLev}}</span>
                    <span>{{levDestwo}}: {{targetLev}}</span>
        </div>
        <div class="row clear">
          <span class="label">所属区域：{{areaName}}</span>
          <span class="label">所属流域：{{basinName}}</span>
        </div>
        <div class="daily-table-wrap">
          <table class="normal-table">
            <tr>
              <th width="134px;">监测项目</th>
              <th v-for="(item,index) in dailyTableHead" :key="index">{{ item.name }}</th>
            </tr>
            <tr v-for="(item,index) in dailyQualityTableBY" :key="index">
              <td>
                <span>{{ item.name }}</span>
              </td>
              <td>
                <span v-if="index === 0">{{ item.acidSalt }}</span>
                <div v-if="index !== 0" class="layoutBox" style="width:80px">
                  <el-input v-model="item.acidSalt"></el-input>
                </div>
                <span>（mg/L）</span>
              </td>
              <td>
                <span v-if="index === 0">{{ item.ammonia }}</span>
                <div v-if="index !== 0" class="layoutBox" style="width:80px">
                  <el-input v-model="item.ammonia"></el-input>
                </div>
                <span>（mg/L）</span>
              </td>
              <td>
                <span v-if="index === 0">{{ item.phosphorus }}</span>
                <div v-if="index !== 0" class="layoutBox" style="width:80px">
                  <el-input v-model="item.phosphorus"></el-input>
                </div>
                <span>（mg/L）</span>
              </td>
              <td>
                <span v-if="index === 0">{{ item.nitrogen }}</span>
                <div v-if="index !== 0" class="layoutBox" style="width:80px">
                  <el-input v-model="item.nitrogen"></el-input>
                </div>
                <span>（mg/L）</span>
              </td>
            </tr>
            <!--<tr>-->
            <!--<td>跨度值</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--</tr>-->
            <!--<tr>-->
            <!--<td>零点标准溶液浓度</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--</tr>-->
            <!--<tr>-->
            <!--<td>跨度标准溶液浓度</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--<td> <div class="layoutBox" style="width:80px"><el-input v-model="tableInput"></el-input></div>（mg/L）</td>-->
            <!--</tr>-->
            <tr>
              <td></td>
              <td v-for="(item,index) in dailyTableHead" :key="index">
                <el-button @click="submitDaily(item)">提交</el-button>
              </td>
            </tr>
          </table>
          <div class="btn-wrap">
            <el-button @click="submitDailyBatch()" style="width: 100px;">批量提交</el-button>
          </div>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "mousequalitycontrolSet",
  data() {
    return {
      levDesone: "目标水质",
      levDestwo: "当前水质",
      targetLev: "", //目标水质
      currentLev: "", //当前水质
      stationName: "",
      areaName: "",
      basinName: "",
      value: [],
      multipointDateRange: "",
      dateRange: "",
      dateRangeJ: "",
      stateRadio: "w01019",
      stateRadioJ: "w01019",
      stateRadioAdd: "w01019",
      stateRadioBY: "w01019",
      radioData: [],
      optionData: [
        { value: 1, label: "水温", standard: "", isShow: true },
        { value: 2, label: "pH", standard: "6~9", isShow: true },
        { value: 3, label: "溶解氧", standard: "≥5", isShow: true },
        { value: 4, label: "电导率", standard: "", isShow: true },
        { value: 5, label: "浊度", standard: "", isShow: true },
        { value: 6, label: "高锰酸盐", standard: "6", isShow: true },
        { value: 7, label: "氨氮", standard: "1", isShow: true },
        { value: 8, label: "总磷", standard: "0.2", isShow: true },
        { value: 9, label: "总氮", standard: "", isShow: true }
      ],
      tableData: [],
      integratedTable: [],
      integratedTableHis: [],
      sampleRatioTable: [],
      recoveryRateTable: [],
      recoveryRateTableHis: [],
      historyCurrentData: [],
      dateRangeBY: [], //标样核查日期选择
      tableDataBYone: [], //标样核查当前表格数据1
      tableDataBYtwo: [], //标样核查历史表格数据2
      dailyBY: false, //标样核查设置弹框控制
      projectSet: false,
      dialogData: [
        {
          monitoringItems: "高锰酸钾",
          waterQuality: "",
          spanValue: "",
          zeroPoint: "",
          span: ""
        },
        {
          monitoringItems: "氨氮",
          waterQuality: "",
          spanValue: "",
          zeroPoint: "",
          span: ""
        },
        {
          monitoringItems: "总磷",
          waterQuality: "",
          spanValue: "",
          zeroPoint: "",
          span: ""
        },
        {
          monitoringItems: "总氮",
          waterQuality: "",
          spanValue: "",
          zeroPoint: "",
          span: ""
        }
      ],
      tabList: [
        {
          name: "多点线性核查"
        },
        {
          name: "集成干预核查"
        },
        {
          name: "实际水样对比"
        },
        {
          name: "加标回收率"
        },
        {
          name: "标样核查"
        }
      ],
      tabActive: 0,
      dailyQuality: false, //参数设置dialog弹窗控制
      tableInput: "",
      singlePoint: false, //单因子单点设置弹窗控制
      integrated: false, //集成干预检查批量设置弹窗控制
      singleNum: "", //单因子单点设置弹窗，浓度绑定值
      integrateDate: "",
      integratedInspect: false, //集成干预检查单独设置弹窗控制
      waterSample: false, //实际水样对比弹窗控制
      recoveryRate: false, //加标回收率批量设置
      recoveryRateAlone: false, //加标回收率单独设置弹窗控制
      stationId: "",

      dailyTableHead: [
        {
          name: "高锰酸盐",
          itemCode: "w01019",
          prop: "acidSalt"
        },
        {
          name: "氨氮",
          itemCode: "w21003",
          prop: "ammonia"
        },
        {
          name: "总磷",
          itemCode: "w21011",
          prop: "phosphorus"
        },
        {
          name: "总氮",
          itemCode: "w21001",
          prop: "nitrogen"
        }
      ],
      // dailyTableHeadBY:[
      //   {
      //     name: "高锰酸盐",
      //     itemCode: "w01019",
      //     prop: "acidSalt"
      //   },
      //   {
      //     name: "氨氮",
      //     itemCode: "w21003",
      //     prop: "ammonia"
      //   },
      //   {
      //     name: "总磷",
      //     itemCode: "w21011",
      //     prop: "phosphorus"
      //   },
      //   {
      //     name: "总氮",
      //     itemCode: "w21001",
      //     prop: "nitrogen"
      //   }
      // ],
      dailyQualityTableBY: [
        {
          name: "上一周的水质平均值",
          acidSalt: "1.9",
          ammonia: "0.12",
          phosphorus: "0.039",
          nitrogen: "4.96"
        },
        {
          name: "量程值",
          acidSalt: "",
          ammonia: "",
          phosphorus: "",
          nitrogen: ""
        },
        {
          name: "标准溶液浓度",
          acidSalt: "",
          ammonia: "",
          phosphorus: "",
          nitrogen: ""
        }
        // {
        //   name:'跨度标准溶液浓度',
        //   acidSalt:'',
        //   ammonia:'',
        //   phosphorus:'',
        //   nitrogen:'',
        // }
      ], //标样核查弹框表格数据
      dailyQualityTable: [
        {
          name: "第一点标液浓度",
          acidSalt: {
            value: "",
            state: "标样核查",
            code: "w01019"
          },
          ammonia: {
            value: "",
            state: "标样核查",
            code: "w21003"
          },
          phosphorus: {
            value: "",
            state: "标样核查",
            code: "w21011"
          },
          nitrogen: {
            value: "",
            state: "标样核查",
            code: "w21001"
          }
        },
        {
          name: "第二点标液浓度",
          acidSalt: {
            value: "",
            state: "标样核查",
            code: "w01019"
          },
          ammonia: {
            value: "",
            state: "标样核查",
            code: "w21003"
          },
          phosphorus: {
            value: "",
            state: "标样核查",
            code: "w21011"
          },
          nitrogen: {
            value: "",
            state: "标样核查",
            code: "w21001"
          }
        },
        {
          name: "第三点标液浓度",
          acidSalt: {
            value: "",
            state: "标样核查",
            code: "w01019"
          },
          ammonia: {
            value: "",
            state: "标样核查",
            code: "w21003"
          },
          phosphorus: {
            value: "",
            state: "标样核查",
            code: "w21011"
          },
          nitrogen: {
            value: "",
            state: "标样核查",
            code: "w21001"
          }
        },
        {
          name: "第四点标液浓度",
          acidSalt: {
            value: "",
            state: "标样核查",
            code: "w01019"
          },
          ammonia: {
            value: "",
            state: "标样核查",
            code: "w21003"
          },
          phosphorus: {
            value: "",
            state: "标样核查",
            code: "w21011"
          },
          nitrogen: {
            value: "",
            state: "标样核查",
            code: "w21001"
          }
        },
        {
          name: "第五点标液浓度",
          acidSalt: {
            value: "",
            state: "标样核查",
            code: "w01019"
          },
          ammonia: {
            value: "",
            state: "标样核查",
            code: "w21003"
          },
          phosphorus: {
            value: "",
            state: "标样核查",
            code: "w21011"
          },
          nitrogen: {
            value: "",
            state: "标样核查",
            code: "w21001"
          }
        },
        {
          name: "第六点标液浓度",
          acidSalt: {
            value: "",
            state: "标样核查",
            code: "w01019"
          },
          ammonia: {
            value: "",
            state: "标样核查",
            code: "w21003"
          },
          phosphorus: {
            value: "",
            state: "标样核查",
            code: "w21011"
          },
          nitrogen: {
            value: "",
            state: "标样核查",
            code: "w21001"
          }
        }
      ],
      resetDailyQualityTable: [],
      selectPointData: {
        prop: "",
        number: ""
      },
      //多点线性-零点核查跨度核查弹窗绑定数据
      linearZeroPoint: false,
      zeroCheckTable: [{}],
      spanVerification: [{}],
      //集成干预测试质控参数信息
      interventionList: [
        {
          name: "已经过集成测试",
          acidSalt: "",
          ammonia: "",
          phosphorus: "",
          nitrogen: ""
        },
        {
          name: "未经过集成测试",
          acidSalt: "",
          ammonia: "",
          phosphorus: "",
          nitrogen: ""
        }
      ],
      resetInterventionData: [],
      //水样测试时间
      waterSampleDate: "",
      recoveryList: [
        {
          name: "加标样浓度",
          acidSalt: "",
          ammonia: "",
          phosphorus: "",
          nitrogen: "",
          company: "mg/L"
        },
        {
          name: "定容体积",
          acidSalt: "",
          ammonia: "",
          phosphorus: "",
          nitrogen: "",
          company: "mL"
        }
      ],
      resetRecoveryList: [],
      stationType:'',
    };
  },
  created() {
    this.$store.commit("setShowlefttree", true);
    this.multipointDateRange = [
      new Date(new Date().setDate(new Date().getDate() - 10)),
      new Date()
    ];
    this.dateRangeJ = [
      new Date(new Date().setDate(new Date().getDate() - 10)),
      new Date()
    ];
    this.dateRange = [
      new Date(new Date().setDate(new Date().getDate() - 10)),
      new Date()
    ];
    this.dateRangeBY = [
      new Date(new Date().setDate(new Date().getDate() - 10)),
      new Date()
    ];
    //拷贝弹窗多点线性核查质控参数信息数据
    this.resetDailyQualityTable = JSON.parse(
      JSON.stringify(this.dailyQualityTable)
    );

    //拷贝集成干预测试质控参数信息
    this.resetInterventionData = JSON.parse(
      JSON.stringify(this.interventionList)
    );

    //拷贝加标回收率参数信息
    this.resetRecoveryList = JSON.parse(JSON.stringify(this.recoveryList));
  },
  methods: {
    //获取当前水质或者污染源等级
    getLev() {
      this.$http
        .get("/Quality/qualityControlSet/getStationCurrentWaterQualityData", {
          params: {
            stationCode: this.stationId
          }
        })
        .then(res => {
          if(this.stationType == '002'){
            this.currentLev = this.paramsObj.setPolluLev(res.data.content.info);
          }else{
            this.currentLev = this.paramsObj.setWaterLev(res.data.content.info);
          }
        });
    },
    //获取月质控多点线性核查质控参数信息
    getCurrentData() {
      this.$http
        .get(
          "/Quality/qualityControlSet/currentMonthQualityControlMultipointParam",
          {
            params: {
              stationCodes: this.stationId
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            this.tableData = res.data.content.dataList;
          }
        });
    },
    //获取历史月质控多点线性核查质控参数信息
    getHistoryCurrentData() {
      this.$http
        .get(
          "/Quality/qualityControlSet/historyMonthQualityControlMultipointParam",
          {
            params: {
              startTime: this.multipointDateRange[0].format("yyyy-MM-dd"),
              endTime: this.multipointDateRange[1].format("yyyy-MM-dd"),
              indexCodes: this.stateRadio,
              stationCodes: this.stationId
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            this.historyCurrentData = res.data.content.dataList;
          }
        });
    },
    //获取月质控集成干预核查质控参数信息
    integratedIntervention() {
      this.$http
        .get(
          "/Quality/qualityControlSet/currentMonthQualityControlIntegratedParam",
          {
            params: {
              stationCodes: this.stationId
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            this.integratedTable = res.data.content.dataList;
          }
        });
    },
    //获取历史月质控集成干预核查质控参数信息
    getHistoryIntervention() {
      this.$http
        .get(
          "/Quality/qualityControlSet/historyMonthQualityControlIntegratedParam",
          {
            params: {
              startTime: this.dateRangeJ[0].format("yyyy-MM-dd"),
              endTime: this.dateRangeJ[1].format("yyyy-MM-dd"),
              indexCodes: this.stateRadioJ,
              stationCodes: this.stationId
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            console.log(222, res.data.content.dataList);
            this.integratedTableHis = res.data.content.dataList;
          }
        });
    },

    //获取月质控实际水样对比质控参数信息
    waterSamples() {
      this.$http
        .get(
          "/Quality/qualityControlSet/currentMonthQualityControlRealWaterParam",
          {
            params: {
              stationCodes: this.stationId
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            this.sampleRatioTable = res.data.content.dataList;
          }
        });
    },

    //获取月质控加标回收率质控参数信息
    recoveryRateAddition() {
      this.$http
        .get(
          "/Quality/qualityControlSet/currentMonthQualityControlRecoveryParam",
          {
            params: {
              stationCodes: this.stationId
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            this.recoveryRateTable = res.data.content.dataList;
          }
        });
    },
    //获取历史月质控加标回收率质控参数信息
    historyIntegratedParam() {
      this.$http
        .get(
          "/Quality/qualityControlSet/historyMonthQualityControlIntegratedParam",
          {
            params: {
              startTime: this.dateRange[0].format("yyyy-MM-dd"),
              endTime: this.dateRange[1].format("yyyy-MM-dd"),
              indexCodes: this.stateRadioAdd,
              stationCodes: this.stationId
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            this.recoveryRateTableHis = res.data.content.dataList;
          }
        });
    },
    //设置月质控多点线性核查质控参数信息 单因子提交
    singleFactorSubmission(item, index) {
      let list = [
        {
          stationCodes: this.stationId,
          indexCode: item.itemCode,
          sourceValues: [],
          pointValues: []
        }
      ];
      this.dailyQualityTable.forEach(n => {
        list[0].sourceValues.push(n[item.prop].state);
        list[0].pointValues.push(parseFloat(n[item.prop].value));
      });
      this.$http
        .post(
          "/Quality/qualityControlSet/editorCurrentMonthQualityControlMultipointParam",
          list
        )
        .then(res => {
          if (res.data.code === 0) {
            this.getCurrentData();
            this.$message({
              message: res.data.message,
              type: "success"
            });
            this.resetDailyQualityTableData();
          }
        });
    },
    //重置多点线性核查质控参数信息数据
    resetDailyQualityTableData() {
      this.dailyQualityTable = JSON.parse(
        JSON.stringify(this.resetDailyQualityTable)
      );
    },
    //选择 零点核查信息-跨度核查信息
    selectZeroPoint(item, index) {
      this.linearZeroPoint = true;
      this.paramZeroDrift(item.code);
      this.paramSpanDrift(item.code);
      this.selectPointData.prop = item.code;
      this.selectPointData.number = index;
    },
    //获取月质控多点线性核查质控设置参数内零点核查信息
    paramZeroDrift(code) {
      // console.log(code);
      this.$http
        .get(
          "/Quality/qualityControlSet/monthQualityControlMultipointParamZeroDrift",
          {
            params: {
              stationCodes: this.stationId,
              indexCodes: code
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            this.zeroCheckTable = res.data.content.dataList;
          }
        });
    },
    //获取月质控多点线性核查质控设置参数内跨度核查信息
    paramSpanDrift(code) {
      this.$http
        .get(
          "/Quality/qualityControlSet/monthQualityControlMultipointParamSpanDrift",
          {
            params: {
              stationCodes: this.stationId,
              indexCodes: code
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            this.spanVerification = res.data.content.dataList;
          }
        });
    },
    //选择零点核查信息
    selectZeroData(item) {
      let code = this.selectPointData.prop;
      let num = this.selectPointData.number;
      for (let i in this.dailyQualityTable[num]) {
        if (
          this.dailyQualityTable[num][i].code &&
          this.dailyQualityTable[num][i].code === code
        ) {
          this.dailyQualityTable[num][i].state = "零点核查";
          this.dailyQualityTable[num][i].value = item.value;
        }
      }
      this.linearZeroPoint = false;
    },
    //选择跨度核查信息
    selectSpanData(item) {
      let code = this.selectPointData.prop;
      let num = this.selectPointData.number;
      for (let i in this.dailyQualityTable[num]) {
        if (
          this.dailyQualityTable[num][i].code &&
          this.dailyQualityTable[num][i].code === code
        ) {
          this.dailyQualityTable[num][i].state = "跨度核查";
          this.dailyQualityTable[num][i].value = item.value;
        }
      }
      this.linearZeroPoint = false;
    },
    //项目设置详情=>表单数据改变时将绑定数据的状态变为‘标样核查’
    changeMonitoringItems(item) {
      item.state = "标样核查";
    },
    //设置月质控集成干预核查质控参数信息
    submitIntegrated(item) {
      let prop = item.prop;
      let param = {
        stationCodes: this.stationId,
        indexCode: item.itemCode,
        notIntegratedTime: this.interventionList[0][prop].format(
          "yyyy-MM-dd hh:00:00"
        ),
        overIntegratedTime: this.interventionList[1][prop].format(
          "yyyy-MM-dd hh:00:00"
        )
      };
      this.$http
        .post(
          "/Quality/qualityControlSet/editorCurrentMonthQualityControlIntegratedParam",
          [param]
        )
        .then(res => {
          if (res.data.code === 0) {
            this.resetIntegrated();
            this.integratedIntervention();
            this.$message({
              message: res.data.message,
              type: "success"
            });
          }
        });
    },
    //批量设置月质控集成干预核查质控参数信息
    batchSubmitIntegrated() {
      let list = [];
      this.dailyTableHead.forEach(item => {
        let param = {
          stationCodes: this.stationId,
          indexCode: item.itemCode,
          notIntegratedTime: this.interventionList[0][item.prop].format(
            "yyyy-MM-dd hh:00:00"
          ),
          overIntegratedTime: this.interventionList[1][item.prop].format(
            "yyyy-MM-dd hh:00:00"
          )
        };
        list.push(param);
      });
      this.$http
        .post(
          "/Quality/qualityControlSet/editorCurrentMonthQualityControlIntegratedParam",
          list
        )
        .then(res => {
          if (res.data.code === 0) {
            this.resetIntegrated();
            this.integratedIntervention();
            this.integrated = false;
            this.$message({
              message: res.data.message,
              type: "success"
            });
          }
        });
    },
    //重置月质控集成干预核查质控参数信息
    resetIntegrated() {
      this.interventionList = JSON.parse(
        JSON.stringify(this.resetInterventionData)
      );
    },
    //设置月质控实际水样对比质控参数信息
    setWaterSampleDate() {
      let param = {
        stationCodes: this.stationId,
        // indexCode:'',
        testTime: this.waterSampleDate.format("yyyy-MM-dd hh:00:00")
      };
      this.$http
        .post(
          "/Quality/qualityControlSet/editorCurrentMonthQualityControlRealWaterParam",
          [param]
        )
        .then(res => {
          if (res.data.code === 0) {
            this.waterSampleDate = "";
            this.waterSample = false;
            this.waterSamples();
            this.$message({
              message: res.data.message,
              type: "success"
            });
          }
        });
    },
    //单个设置月质控加标回收率质控参数信息
    submitRecoveryRate(item, index) {
      let param = {
        stationCodes: this.stationId,
        indexCode: item.itemCode,
        addConcentration: this.recoveryList[0][item.prop],
        constantVolume: this.recoveryList[1][item.prop]
      };
      this.$http
        .post(
          "/Quality/qualityControlSet/editorCurrentMonthQualityControlRecoveryParam",
          [param]
        )
        .then(res => {
          if (res.data.code === 0) {
            this.recoveryRateAddition();
            this.resetRecoveryListData();
            this.recoveryRate = false;
            this.$message({
              message: res.data.message,
              type: "success"
            });
          }
        });
    },
    //重置月质控加标回收率质控参数信息
    resetRecoveryListData() {
      this.recoveryList = JSON.parse(JSON.stringify(this.resetRecoveryList));
    },
    //批量设置月质控加标回收率质控参数信息
    batchSubmitRecoveryRate() {
      let list = [];
      this.dailyTableHead.forEach((item, index) => {
        let param = {
          stationCodes: this.stationId,
          indexCode: item.itemCode,
          addConcentration: this.recoveryList[0][item.prop],
          constantVolume: this.recoveryList[1][item.prop]
        };
        list.push(param);
      });
      this.$http
        .post(
          "/Quality/qualityControlSet/editorCurrentMonthQualityControlRecoveryParam",
          list
        )
        .then(res => {
          if (res.data.code === 0) {
            this.recoveryRateAddition();
            this.resetRecoveryListData();
            this.$message({
              message: res.data.message,
              type: "success"
            });
          }
        });
    },

    //转换月份
    setMonthConvert(time) {
      let date = parseInt(new Date(time).format("M"));
      let str = "";
      switch (date) {
        case 1:
          str = "一";
          break;
        case 2:
          str = "二";
          break;
        case 3:
          str = "三";
          break;
        case 4:
          str = "四";
          break;
        case 5:
          str = "五";
          break;
        case 6:
          str = "六";
          break;
        case 7:
          str = "七";
          break;
        case 8:
          str = "八";
          break;
        case 9:
          str = "九";
          break;
        case 10:
          str = "十";
          break;
        case 11:
          str = "十一";
          break;
        case 12:
          str = "十二";
          break;
      }
      return str + "月";
    },
    //标样核查设置单个因子提交
    submitDaily(item) {
      let param = {
        stationCodes: this.stationId, //this.stationId,
        indexCode: item.itemCode,
        spanValue: this.dailyQualityTableBY[1][item.prop],
        standardValue: this.dailyQualityTableBY[2][item.prop]
      };
      this.$http
        .post(
          "/Quality/qualityControlSet/editorCurrentMonthQualityControlStandardCheckParam",
          [param]
        )
        .then(res => {
          if (res.data.code === 0) {
            this.dailyQualityTableBY[1][item.prop] = "";
            this.dailyQualityTableBY[2][item.prop] = "";
            this.getByCurrentData();
            this.getByhistoryDayQuality();

            this.$message({
              message: res.data.message,
              type: "success"
            });
          }
        });
    },
    //标样核查设置批量提交
    submitDailyBatch() {
      let list = [];
      this.dailyTableHead.forEach(item => {
        let param = {
          stationCodes: this.stationId,
          indexCode: item.itemCode,
          spanValue: this.dailyQualityTableBY[1][item.prop],
          standardValue: this.dailyQualityTableBY[2][item.prop]
        };
        list.push(param);
      });
      // console.log(list);
      this.$http
        .post(
          "/Quality/qualityControlSet/editorCurrentMonthQualityControlStandardCheckParam",
          list
        )
        .then(res => {
          if (res.data.code === 0) {
            this.dailyBY = false;
            this.$message({
              message: res.data.message,
              type: "success"
            });
            this.getByCurrentData();
            this.getByhistoryDayQuality();
          }
        });
    },
    //获取标样核查当前使用24小时质控参数信息
    getByCurrentData() {
      this.$http
        .get(
          "/Quality/qualityControlSet/currentMonthQualityControlStandardCheckParam",
          {
            params: {
              stationCodes: this.stationId
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            this.tableDataBYone = res.data.content.dataList;
          }
        });
    },
    //获取标样核查历史设置24小时质控参数信息
    getByhistoryDayQuality() {
      this.$http
        .get(
          "/Quality/qualityControlSet/historyMonthQualityControlStandardCheckParam",
          {
            params: {
              startTime: this.dateRangeBY[0].format("yyyy-MM-dd"),
              endTime: this.dateRangeBY[1].format("yyyy-MM-dd"),
              indexCodes: this.stateRadioBY,
              stationCodes: this.stationId
            }
          }
        )
        .then(res => {
          if (res.data.code === 0) {
            this.tableDataBYtwo = res.data.content.dataList;
          }
        });
    }
  },
  computed: {
    totalPageNumber() {
      //计算总页数
      let number = 0;
      number = Math.ceil(this.total / this.pageSize);
      return number;
    },
    stationInfo: {
      get: function() {
        return this.$store.state.stationInfo;
      }
    }
  },
  watch: {
    stationInfo(value) {
      if (value.length > 0) {
        this.stationId = value[0].nodeId;
       this.stationType=value[0].stationType1;
        this.stationName = value[0].nodeName;
        this.areaName = value[0].areaName;
        this.basinName = value[0].basinName;
        if (value[0].stationType1 === "002") {
          //this.stateRadio='w01018';
           this.targetLev = this.paramsObj.setPolluLev(
          value[0].targerWaterQuality
        );
          this.stateRadio = "w01018";
          this.stateRadioJ = "w01018";
          this.stateRadioAdd = "w01018";
          this.stateRadioBY = "w01018";
          this.levDesone = "当前排放";
          this.levDestwo = "排放标准";
          this.radioData = [
            { id: "w01018", label: "COD" },
            { id: "w21003", label: "氨氮" },
            { id: "w21011", label: "总磷" },
            { id: "w21001", label: "总氮" }
          ];
          this.dailyTableHead = [
            {
              name: "COD",
              itemCode: "w01018",
              prop: "acidSalt"
            },
            {
              name: "氨氮",
              itemCode: "w21003",
              prop: "ammonia"
            },
            {
              name: "总磷",
              itemCode: "w21011",
              prop: "phosphorus"
            },
            {
              name: "总氮",
              itemCode: "w21001",
              prop: "nitrogen"
            }
          ];
        } else {
           this.targetLev = this.paramsObj.setWaterLev(
          value[0].targerWaterQuality
        );
          this.stateRadio = "w01019";
          this.stateRadioJ = "w01019";
          this.stateRadioAdd = "w01019";
          this.stateRadioBY = "w01019";
          this.dailyTableHead = [
            {
              name: "高锰酸盐",
              itemCode: "w01019",
              prop: "acidSalt"
            },
            {
              name: "氨氮",
              itemCode: "w21003",
              prop: "ammonia"
            },
            {
              name: "总磷",
              itemCode: "w21011",
              prop: "phosphorus"
            },
            {
              name: "总氮",
              itemCode: "w21001",
              prop: "nitrogen"
            }
          ];
          this.radioData = [
            { id: "w01019", label: "高锰酸盐" },
            { id: "w21003", label: "氨氮" },
            { id: "w21011", label: "总磷" },
            { id: "w21001", label: "总氮" }
          ];
          this.levDesone = "当前水质";
          this.levDestwo = "目标水质";
        }
        this.getLev();
        this.getCurrentData();
        this.getHistoryCurrentData();
        this.integratedIntervention();
        this.getHistoryIntervention();
        this.waterSamples();
        this.recoveryRateAddition();
        this.historyIntegratedParam();
        this.getByCurrentData();
        this.getByhistoryDayQuality();
      }
    }
  }
};
</script>

<style scoped lang="less">
.editInput {
  width: 50px;
  border: none;
  outline: none;
}
.modular-box {
  border: 1px solid #dce9fa;
  margin-top: 6px;
  .modular-header {
    height: 40px;
    line-height: 40px;
    padding: 0 8px;
    border-bottom: 1px solid #dce9fa;
    .title {
      font-size: 16px;
    }
    .title:before {
      content: "";
      display: inline-block;
      vertical-align: middle;
      width: 3px;
      height: 10px;
      background: #166bce;
      margin-bottom: 3px;
      margin-right: 16px;
    }
  }
  .modular-body {
    min-height: 100px;
  }
  .toolbar {
    float: right;
    line-height: 38px;
    & > button {
      margin-bottom: 3px;
    }
  }
  .modular-row {
    padding: 6px;
  }
}
.currency-body-wrap {
  height: calc(100% - 52px);
  width: calc(100% - 154px);
  float: left;
}
.currency-aside-wrap {
  height: calc(100% - 52px);
  width: 148px;
  float: right;
  border: 1px solid #dce9fa;
  margin-top: 6px;
  padding: 6px;
  ul {
    border: 1px solid #cad9eb;
    li {
      height: 28px;
      line-height: 28px;
      padding: 0 6px;
      text-align: center;
      border-bottom: 1px solid #cad9eb;
      cursor: pointer;
      font-size: 12px;
      &:last-child {
        border-bottom: none;
      }
      &:hover {
        color: #2977d2;
      }
    }
    li.active {
      background: #e6f1fc;
      color: #2977d2;
    }
  }
}
.statistics-text {
  display: inline-block;
  vertical-align: top;
  position: relative;
  background: #e6f1fc;
  border: 1px solid #cad9eb;
  line-height: 36px;
  height: 36px;
  padding: 0 10px;
  .title {
    color: #186cce;
    font-size: 16px;
  }
  & > span {
    margin-right: 24px;
  }
  & > span:last-child {
    margin-right: 0;
  }
  &:before {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    border: 2px solid #166bce;
    border-right: none;
    border-bottom: none;
    top: -1px;
    left: -1px;
  }
  &:after {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    border: 2px solid #166bce;
    border-top: none;
    border-left: none;
    right: -1px;
    bottom: -1px;
  }
}
.week-row {
  padding: 10px 10px 0;
  /*height: 166px;*/
  font-size: 12px;
  .date-box {
    float: left;
    border: 1px solid #cad9eb;
    height: 146px;
    margin-right: 20px;
    text-align: center;
    width: 78px;
    padding-top: 52px;
    .month {
      font-size: 16px;
    }
  }
  .quality-control-list {
    float: left;
    max-width: calc(100% - 400px);
    & > li {
      float: left;
      border: 1px solid #cad9eb;
      height: 100%;
      margin-right: 20px;
      width: 148px;
      margin-bottom: 10px;
      & > div {
        padding: 0 10px;
        height: 28px;
        line-height: 28px;
        border-bottom: 1px solid #cad9eb;
        &:first-child {
          height: 33px;
          line-height: 32px;
          text-align: center;
          background: #e6f1fc;
          color: #2072d0;
        }
        &:last-child {
          border-bottom: none;
        }
      }
    }
  }
  .correlation-box {
    float: left;
    border: 1px solid #cad9eb;
    height: 146px;
    margin-right: 20px;
    text-align: center;
    padding: 0 8px;
    width: 80px;
    & > div {
      height: 50%;
      &:first-child {
        padding-top: 18px;
        border-bottom: 1px solid #d8d8d8;
      }
      .data {
        font-size: 15px;
      }
      .qualified,
      .unqualified {
        display: inline-block;
        vertical-align: top;
        width: 56px;
        height: 46px;
        line-height: 46px;
        text-align: center;
        margin-top: 13px;
      }
      .qualified {
        border: 1px solid #67c239;
        color: #67c239;
        background: #f0f9eb;
      }
      .unqualified {
        border: 1px solid #f56c6c;
        color: #f56c6c;
        background: #fef0f0;
      }
    }
  }
  .influence-box {
    float: left;
    border: 1px solid #cad9eb;
    height: 146px;
    text-align: center;
    width: 80px;
    padding-top: 52px;
    .data {
      font-size: 17px;
    }
  }
}
/* 日质控设置弹窗样式 */
.daily-quality-box {
  .daily-head-wrap {
    .row {
      padding-bottom: 10px;
      & > span {
        width: 50%;
        float: left;
      }
    }
  }
  .daily-table-wrap {
    .normal-table {
      th {
        text-align: center;
        height: 40px;
      }
      td {
        text-align: center;
        padding: 4px;
        height: 40px;
      }
    }
    .btn-wrap {
      text-align: center;
      padding-top: 10px;
    }
  }
}
.single-point-wrap {
  & > div {
    padding-bottom: 10px;
  }
}
.integrated-intervention {
  .normal-table {
    width: 100%;
    th {
      text-align: center;
      height: 40px;
    }
    td {
      text-align: center;
      padding: 4px;
      height: 40px;
    }
  }
  .btn-wrap {
    text-align: center;
    padding-top: 10px;
  }
}
.recovery-rate {
  .normal-table {
    width: 100%;
    th {
      text-align: center;
      height: 40px;
    }
    td {
      text-align: center;
      padding: 4px;
      height: 40px;
    }
  }
  .btn-wrap {
    text-align: center;
    padding-top: 10px;
  }
}
.be-careful-text {
  text-align: left;
  color: red;
}
.company-text {
  width: 50px;
  display: inline-block;
  vertical-align: middle;
  text-align: left;
  padding-left: 4px;
}
</style>
